<template>
    <div class="allbuju"> 
        <div id="top">
            <!--左-->
            <div class="topleft" @click="tiaozhuan"> 
                <!-- 以下语句是为了使用有色图标 -->
                <svg class="icon" aria-hidden="true">
                    <use xlink:href="#icon-arrow-left"></use>
                </svg>
            </div>
            <div class="topContent">
                <span>社区互动</span>
            </div>
        </div>
        <div id="content">
            <img src="@/assets/icon4.png">
        </div>
    </div>
</template>

<script>
export default{
    name:"Top",
    methods:{
        //跳转到消息中心
        tiaozhuan:function(){
            this.$router.replace('/xiaoxizhanshi')
        }
    }
}
</script>

<style lang="less" scoped>
#top{
        width: 100%;
        height: 50px;
        //弹性布局！！！！！
        display: flex;                 ///！！！！！！
        justify-content: space-between; ///！！！！！！
        align-items: center;//垂直居中
}
.topContent{
    margin-right: 42%;
}
#content{
    width: 100%;
    height: 100%;
}
img{
    width: 110px;
    height: 110px;
    margin-top: 30%;
    margin-left: 36%;
}
</style>